<template>
  <div v-if="config.show">
    <div class="van-overlay" style="z-index: 2002"></div>
    <div
      class="van-popup van-popup--center van-dialog van-dialog--round-button"
      role="dialog"
      tabindex="0"
      aria-labelledby="提示"
      style="z-index: 2003"
    >
      <div class="van-dialog__header">{{ config.title }}</div>
      <div class="van-dialog__content">
        <div class="van-dialog__message van-dialog__message--has-title">
          <div class="fz-14">{{ config.message }}</div>
        </div>
      </div>
      <div class="van-action-bar van-safe-area-bottom van-dialog__footer">
        <van-button class="mr-5" size="small" round block @click="onHide">关闭</van-button>
        <van-button size="small" round icon="service-o" type="danger" block @click="onContact">联系客服</van-button>
      </div>
    </div>
    <div
      class="van-popup van-popup--center van-dialog"
      role="dialog"
      style="z-index: 2002"
    >
    </div>
  </div>
</template>

<script>
import { defineComponent } from "vue";
import { Icon, Button } from "vant";
import { onContact } from "@/utils";
import { useConfig, triggerTipDialog } from '@/composition/errorTipDialogConfig'
export default defineComponent({
  components: {
    [Icon.name]: Icon,
    [Button.name]: Button,
  },
  setup() {
    const config = useConfig()

    const onHide = () => {
      triggerTipDialog({show: false});
    };
    return {
      onContact,
      onHide,
      config,
    };
  },
});
</script>

<style lang="less" scoped></style>
